<template>
    <div class="profile">
        <div class="profile-top">
            <img src="~assets/images/profile/ebankings.png" alt="">
            <div class="nickname">Yang</div>
            <div class="point">VIP.2[全国节点]</div>
        </div>
        <div class="invitation"></div>
        <div class="mean-list">
            <van-grid :gutter="1" :column-num="2" icon-size="1.5rem">
                <van-grid-item :icon="require('assets/images/profile/setting.png')" text="个人中心" />
                <van-grid-item :icon="require('assets/images/profile/weather.png')" text="我要签到" />
                <van-grid-item :icon="require('assets/images/profile/edit.png')" text="帮助中心" />
                <van-grid-item :icon="require('assets/images/profile/inform.png')" text="系统设置" />
                <van-grid-item :icon="require('assets/images/profile/star.png')" text="意见反馈" />
                <van-grid-item :icon="require('assets/images/profile/cloud.png')" text="地址簿" />
                <van-grid-item :icon="require('assets/images/profile/cloud.png')" text="火种闪兑" />
                <van-grid-item :icon="require('assets/images/profile/cloud.png')" text="退出登录" />
            </van-grid>
        </div>
    </div>
</template>

<script>
  export default {
    name: "Profile",
  }
</script>

<style scoped>
.profile-top{
    background-image: url("~assets/images/profile/spes.png");
    background-repeat: no-repeat;
    background-size: 100% 579px;
    width: 100%;
    height: 579px;
    text-align: center;
}
.profile-top img{
    padding-top: 120px;
    width: 154.5px;
}
.invitation{
    background-image: url("~assets/images/profile/invitation.png");
    width: 885px;
    height: 240px;
    background-repeat: no-repeat;
    background-size: 885px;
    position: relative;
    top: -136px;
    margin: 0 auto;
}
.mean-list{
    margin-top: -100px;
}
.nickname{
    padding-top: 20px;
   font-size: 38px;
    color: #fff;
}
.point{
    padding-top: 20px;
    color: #B8C3FF;
    font-size: 38px;
}
</style>
